@aum-deriv need your opinion on this. how about instead of limit the layout to only have two columns we have sth more general where the consumer can pass as many columns as they need and control the style with props.

for instance this:

<Layout>
    <Column flex={1} classname="sidebar">...</Column>
    <Column flex={2} classname="content">...</Column>    
</Layout>

<Layout>
    <Column flex={1} classname="sidebar">...</Column>
    <Column flex={2} classname="content">...</Column>    
    <Column flex={1} classname="left-sidebar">...</Column>  
</Layout>

<Layout>
    <Column flex={1} classname="sidebar">...</Column>
    <Column flex={1} classname="content">...</Column>    
    <Column flex={1} classname="sidenote">...</Column>  
</Layout>

then the consumer can decide which one is suitable for their case. for instance maybe the accounts team want to use context to handle the shared data between content and sideNote then they can go with the second example or the cashier decide to use the first one.

what do you think guys?
@ali-hosseini-deriv @markwylde-deriv @aizad-deriv @amina-deriv @wojciech-deriv

@aum-deriv need your opinion on this. how about instead of limit the layout to only have two columns we have sth more general where the consumer can pass as many columns as they need and control the style with props.

for instance this:

<Layout>
    <Column flex={1} classname="sidebar">...</Column>
    <Column flex={2} classname="content">...</Column>    
</Layout>

<Layout>
    <Column flex={1} classname="sidebar">...</Column>
    <Column flex={2} classname="content">...</Column>    
    <Column flex={1} classname="left-sidebar">...</Column>  
</Layout>

<Layout>
    <Column flex={1} classname="sidebar">...</Column>
    <Column flex={1} classname="content">...</Column>    
    <Column flex={1} classname="sidenote">...</Column>  
</Layout>

then the consumer can decide which one is suitable for their case. for instance maybe the accounts team want to use context to handle the shared data between content and sideNote then they can go with the second example or the cashier decide to use the first one.

what do you think guys? @ali-hosseini-deriv @markwylde-deriv @aizad-deriv @amina-deriv @wojciech-deriv

My feeling is, that we shouldn't overly generalise. There are plenty of open-source layouting frameworks and I'm pretty sure we do not want to build another one internally due to overgeneralisation.
So basically - keep it specific to current deriv use cases. If right now we only need 2-column layout of specific widths, then lets keep it that way.
Or even generate two separate components - PageLayout2Col, PageLayout3Col - KISS / YAGNI.
I think its actually desired to not have full flexibility. I think its very desirable for ppl / designers to follow standard / agreed layouts across applications. To increase design consistency across products

🎉 This PR is included in version 1.1.8 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀